<!DOCTYPE html>
<html lang="en"><head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1"><!-- Begin Jekyll SEO tag v2.8.0 -->
<title>0069: TextView and TextBuffer | gtkDcoding</title>
<meta name="generator" content="Jekyll v4.3.4" />
<meta property="og:title" content="0069: TextView and TextBuffer" />
<meta name="author" content="Ron Tarrant" />
<meta property="og:locale" content="en_US" />
<meta name="description" content="GTK Tutorial covering the basics of using a TextView widget and it’s companion, the TextBuffer." />
<meta property="og:description" content="GTK Tutorial covering the basics of using a TextView widget and it’s companion, the TextBuffer." />
<link rel="canonical" href="http://localhost:4000/posts/0069-textview-and-textbuffer.html" />
<meta property="og:url" content="http://localhost:4000/posts/0069-textview-and-textbuffer.html" />
<meta property="og:site_name" content="gtkDcoding" />
<meta property="og:type" content="article" />
<meta property="article:published_time" content="2019-09-10T00:00:00-04:00" />
<meta name="twitter:card" content="summary" />
<meta property="twitter:title" content="0069: TextView and TextBuffer" />
<script type="application/ld+json">
{"@context":"https://schema.org","@type":"BlogPosting","author":{"@type":"Person","name":"Ron Tarrant"},"dateModified":"2019-09-10T00:00:00-04:00","datePublished":"2019-09-10T00:00:00-04:00","description":"GTK Tutorial covering the basics of using a TextView widget and it’s companion, the TextBuffer.","headline":"0069: TextView and TextBuffer","mainEntityOfPage":{"@type":"WebPage","@id":"http://localhost:4000/posts/0069-textview-and-textbuffer.html"},"url":"http://localhost:4000/posts/0069-textview-and-textbuffer.html"}</script>
<!-- End Jekyll SEO tag -->
<link rel="stylesheet" href="../assets/main.css">
  <link rel="stylesheet" href="../css/style.css" /><link type="application/atom+xml" rel="alternate" href="http://localhost:4000/feed.xml" title="gtkDcoding" /></head>
<body><header class="site-header" role="banner">

  <div class="wrapper"><a class="site-title" rel="author" href="../">gtkDcoding</a><nav class="site-nav">
        <input type="checkbox" id="nav-trigger" class="nav-trigger" />
        <label for="nav-trigger">
          <span class="menu-icon">
            <svg viewBox="0 0 18 15" width="18px" height="15px">
              <path d="M18,1.484c0,0.82-0.665,1.484-1.484,1.484H1.484C0.665,2.969,0,2.304,0,1.484l0,0C0,0.665,0.665,0,1.484,0 h15.032C17.335,0,18,0.665,18,1.484L18,1.484z M18,7.516C18,8.335,17.335,9,16.516,9H1.484C0.665,9,0,8.335,0,7.516l0,0 c0-0.82,0.665-1.484,1.484-1.484h15.032C17.335,6.031,18,6.696,18,7.516L18,7.516z M18,13.516C18,14.335,17.335,15,16.516,15H1.484 C0.665,15,0,14.335,0,13.516l0,0c0-0.82,0.665-1.483,1.484-1.483h15.032C17.335,12.031,18,12.695,18,13.516L18,13.516z"/>
            </svg>
          </span>
        </label>

        <div class="trigger"><a class="page-link" href="../about.html">About</a><a class="page-link" href="../index-reverse.html">Posts in Date Order</a><a class="page-link" href="../topics.html">Blog Posts by Topic</a></div>
      </nav></div>
</header>
<main class="page-content" aria-label="Content">
      <div class="wrapper">
        <article class="post h-entry" itemscope itemtype="http://schema.org/BlogPosting">
	<header class="post-header">
		<link rel="stylesheet" href="../css/font_size.css" />
		<link rel="stylesheet" href="../css/figure.css" />
		<link rel="stylesheet" href="../css/topics/text.css" />  <!-- sub in the tag/topic -->
		<link rel="stylesheet" href="../css/modal.css" />
		<link rel="stylesheet" href="../css/post.css" />
		<link rel="stylesheet" href="../css/mascot_effects.css" />

		
		
		<p class="post-meta">
		<time class="dt-published" datetime="2019-09-10T00:00:00-04:00" itemprop="datePublished">Tuesday, September 10, 2019
		</time>• by <span itemprop="author" itemscope itemtype="http://schema.org/Person"><span class="p-author h-card" itemprop="name">Ron Tarrant</span></span></p>
	</header>

	<div class="post-content e-content" itemprop="articleBody">
		<div class="skew-line"></div>
		<h1 id="0069-textview-and-textbuffer">0069: TextView and TextBuffer</h1>

<p>These two widgets, working together, give us the basis for text/code editors, word processors, and other DTP software. The <code class="language-plaintext highlighter-rouge">TextView</code> not only shows us what’s contained in the <code class="language-plaintext highlighter-rouge">TextBuffer</code>, it gives us access so we can edit, append, etc.</p>

<h2 id="a-simple-text-editor">A Simple Text Editor</h2>

<!-- 0, 1 -->
<!-- first occurrence of application and terminal screen shots on a single page -->
<div class="screenshot-frame">
	<div class="frame-header">
		Results of this example:
	</div>
	<div class="frame-screenshot">
		<figure>
			<img id="img0" src="../images/screenshots/006_text/text_08.png" alt="Current example output" />		<!-- img# -->
			
			<!-- Modal for screenshot -->
			<div id="modal0" class="modal">																	<!-- modal# -->
				<span class="close0">&times;</span>															<!-- close# -->
				<img class="modal-content" id="img00" />															<!-- img## -->
				<div id="caption"></div>
			</div>
			
			<script>
			// Get the modal
			var modal = document.getElementById("modal0");														// modal#
			
			// Get the image and insert it inside the modal - use its "alt" text as a caption
			var img = document.getElementById("img0");															// img#
			var modalImg = document.getElementById("img00");													// img##
			var captionText = document.getElementById("caption");

			img.onclick = function()
			{
			  modal.style.display = "block";
			  modalImg.src = this.src;
			  captionText.innerHTML = this.alt;
			}
			
			// Get the <span> element that closes the modal
			var span = document.getElementsByClassName("close0")[0];											// close#
			
			// When the user clicks on <span> (x), close the modal
			span.onclick = function()
			{ 
				modal.style.display = "none";
			}
			</script>
			<figcaption>
			Current example output
			</figcaption>
		</figure>
	</div>

	<div class="frame-terminal">
		<figure class="right">
			<img id="img1" src="../images/screenshots/006_text/text_08_term.png" alt="Current example terminal output" />		<!-- img#, filename -->

			<!-- Modal for terminal shot -->
			<div id="modal1" class="modal">																				<!-- modal# -->
				<span class="close1">&times;</span>																		<!-- close# -->
				<img class="modal-content" id="img11" />																		<!-- img## -->
				<div id="caption"></div>
			</div>
			
			<script>
			// Get the modal
			var modal = document.getElementById("modal1");																	// modal#
			
			// Get the image and insert it inside the modal - use its "alt" text as a caption
			var img = document.getElementById("img1");																		// img#
			var modalImg = document.getElementById("img11");																// img##
			var captionText = document.getElementById("caption");

			img.onclick = function()
			{
			  modal.style.display = "block";
			  modalImg.src = this.src;
			  captionText.innerHTML = this.alt;
			}
			
			// Get the <span> element that closes the modal
			var span = document.getElementsByClassName("close1")[0];														// close#
			
			// When the user clicks on <span> (x), close the modal
			span.onclick = function()
			{ 
				modal.style.display = "none";
			}
			</script>

			<figcaption>
				Current example terminal output (click for enlarged view)
			</figcaption>
		</figure>
	</div>

	<div class="frame-footer">																								<!-- ------------- filename (below) --------- -->
		The code file for this example is available <a href="https://github.com/rontarrant/gtkd_demos/blob/master/006_text/text_08_textview.d" target="_blank">here</a>.
	</div>
</div>
<!-- end of snippet for first (1st) occurrence of application and terminal screen shots on a single page -->

<p>To get the <code class="language-plaintext highlighter-rouge">TextView</code> into a <code class="language-plaintext highlighter-rouge">Window</code> in any kind of useful way also means using a <code class="language-plaintext highlighter-rouge">ScrolledWindow</code> as an intermediary container. After all, there’s no point in having hundreds of lines of text if you only have visual access to the first dozen. (There’s nothing like typing blind to keep you both focused and stressed.)</p>

<p>So, we stuff a <code class="language-plaintext highlighter-rouge">ScrolledWindow</code> into our usual <code class="language-plaintext highlighter-rouge">AppBox</code>, and stuff the <code class="language-plaintext highlighter-rouge">TextView</code> into the <code class="language-plaintext highlighter-rouge">ScrolledWindow</code>… like this:</p>

<div class="language-d highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="k">class</span> <span class="n">AppBox</span> <span class="p">:</span> <span class="n">Box</span>
<span class="p">{</span>
	<span class="kt">bool</span> <span class="n">expand</span> <span class="p">=</span> <span class="kc">true</span><span class="p">,</span> <span class="n">fill</span> <span class="p">=</span> <span class="kc">true</span><span class="p">;</span>
	<span class="kt">uint</span> <span class="n">globalPadding</span> <span class="p">=</span> <span class="mi">10</span><span class="p">,</span> <span class="n">localPadding</span> <span class="p">=</span> <span class="mi">5</span><span class="p">;</span>
	<span class="n">ScrolledTextWindow</span> <span class="n">scrolledTextWindow</span><span class="p">;</span>
	
	<span class="k">this</span><span class="p">()</span>
	<span class="p">{</span>
		<span class="k">super</span><span class="p">(</span><span class="n">Orientation</span><span class="p">.</span><span class="n">VERTICAL</span><span class="p">,</span> <span class="n">globalPadding</span><span class="p">);</span>
		
		<span class="n">scrolledTextWindow</span> <span class="p">=</span> <span class="k">new</span> <span class="n">ScrolledTextWindow</span><span class="p">();</span>
		
		<span class="n">packStart</span><span class="p">(</span><span class="n">scrolledTextWindow</span><span class="p">,</span> <span class="n">expand</span><span class="p">,</span> <span class="n">fill</span><span class="p">,</span> <span class="n">localPadding</span><span class="p">);</span> <span class="c1">// TOP justify</span>
		
	<span class="p">}</span> <span class="c1">// this()</span>

<span class="p">}</span> <span class="c1">// class AppBox</span>


<span class="k">class</span> <span class="n">ScrolledTextWindow</span> <span class="p">:</span> <span class="n">ScrolledWindow</span>
<span class="p">{</span>
	<span class="n">MyTextView</span> <span class="n">myTextView</span><span class="p">;</span>
	
	<span class="k">this</span><span class="p">()</span>
	<span class="p">{</span>
		<span class="k">super</span><span class="p">();</span>
		
		<span class="n">myTextView</span> <span class="p">=</span> <span class="k">new</span> <span class="n">MyTextView</span><span class="p">();</span>
		<span class="n">add</span><span class="p">(</span><span class="n">myTextView</span><span class="p">);</span>
		
	<span class="p">}</span> <span class="c1">// this()</span>
	
<span class="p">}</span> <span class="c1">// class ScrolledTextWindow</span>
</code></pre></div></div>

<h3 id="textbuffer">TextBuffer</h3>

<p>We don’t have to instantiate the <code class="language-plaintext highlighter-rouge">TextBuffer</code> because the <code class="language-plaintext highlighter-rouge">TextView</code> already has one associated with it when it’s instantiated. But, there is some flexibility here. We could end up with this association between a <code class="language-plaintext highlighter-rouge">TextView</code> and a <code class="language-plaintext highlighter-rouge">TextBuffer</code> in a few different ways:</p>

<ul>
  <li>instantiate a <code class="language-plaintext highlighter-rouge">TextView</code> and grab a pointer to its <code class="language-plaintext highlighter-rouge">TextBuffer</code> (as we’re doing in this example),</li>
  <li>instantiate the <code class="language-plaintext highlighter-rouge">TextBuffer</code> first and pass it to the <code class="language-plaintext highlighter-rouge">TextView</code>’s overloaded constructor—which doesn’t seem all that useful to me unless you…</li>
  <li>instantiate one <code class="language-plaintext highlighter-rouge">TextView</code> and pass its <code class="language-plaintext highlighter-rouge">TextBuffer</code> along to the constructors for one or more other <code class="language-plaintext highlighter-rouge">TextView</code>s so they can share.</li>
</ul>

<p>But in this example, we’ll do it the simplest way:</p>

<div class="language-d highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="k">class</span> <span class="n">MyTextView</span> <span class="p">:</span> <span class="n">TextView</span>
<span class="p">{</span>
	<span class="n">TextBuffer</span> <span class="n">textBuffer</span><span class="p">;</span>
	<span class="nb">string</span> <span class="n">content</span> <span class="p">=</span> <span class="s">"Now is the English of our discontent."</span><span class="p">;</span>
	
	<span class="k">this</span><span class="p">()</span>
	<span class="p">{</span>
		<span class="k">super</span><span class="p">();</span>
		<span class="n">textBuffer</span> <span class="p">=</span> <span class="n">getBuffer</span><span class="p">();</span>
		<span class="n">textBuffer</span><span class="p">.</span><span class="n">setText</span><span class="p">(</span><span class="n">content</span><span class="p">);</span>

	<span class="p">}</span> <span class="c1">// this()</span>

<span class="p">}</span> <span class="c1">// class MyTextView</span>
</code></pre></div></div>

<p>Within the <code class="language-plaintext highlighter-rouge">MyTextView</code> constructor, a quick call to <code class="language-plaintext highlighter-rouge">getBuffer()</code> gives us access and from there, we give it some content with <code class="language-plaintext highlighter-rouge">setText()</code>.</p>

<p>But for thoroughness sake, let’s also look at a shared <code class="language-plaintext highlighter-rouge">TextBuffer</code>…</p>

<h2 id="textviews-with-a-shared-textbuffer">TextViews with a Shared TextBuffer</h2>

<!-- 2, 3 -->
<!-- second occurrence of application and terminal screen shots on a single page -->
<div class="screenshot-frame">
	<div class="frame-header">
		Results of this example:
	</div>
	<div class="frame-screenshot">
		<figure>
			<img id="img2" src="../images/screenshots/006_text/text_09.png" alt="Current example output" />		<!-- img# -->
			
			<!-- Modal for screenshot -->
			<div id="modal2" class="modal">																<!-- modal# -->
				<span class="close2">&times;</span>														<!-- close# -->
				<img class="modal-content" id="img22" />														<!-- img## -->
				<div id="caption"></div>
			</div>
			
			<script>
			// Get the modal
			var modal = document.getElementById("modal2");													// modal#
			
			// Get the image and insert it inside the modal - use its "alt" text as a caption
			var img = document.getElementById("img2");														// img#
			var modalImg = document.getElementById("img22");												// img##
			var captionText = document.getElementById("caption");

			img.onclick = function()
			{
			  modal.style.display = "block";
			  modalImg.src = this.src;
			  captionText.innerHTML = this.alt;
			}
			
			// Get the <span> element that closes the modal
			var span = document.getElementsByClassName("close2")[0];										// close#
			
			// When the user clicks on <span> (x), close the modal
			span.onclick = function()
			{ 
				modal.style.display = "none";
			}
			</script>
			<figcaption>
			Current example output
			</figcaption>
		</figure>
	</div>

	<div class="frame-terminal">
		<figure class="right">
			<img id="img3" src="../images/screenshots/006_text/text_09_term.png" alt="Current example terminal output" /> 		<!-- img#, filename -->

			<!-- Modal for terminal shot -->
			<div id="modal3" class="modal">																			<!-- modal# -->
				<span class="close3">&times;</span>																	<!-- close# -->
				<img class="modal-content" id="img33" />																	<!-- img## -->
				<div id="caption"></div>
			</div>
			
			<script>
			// Get the modal
			var modal = document.getElementById("modal3");																// modal#
			
			// Get the image and insert it inside the modal - use its "alt" text as a caption
			var img = document.getElementById("img3");																	// img#
			var modalImg = document.getElementById("img33");															// img##
			var captionText = document.getElementById("caption");

			img.onclick = function()
			{
			  modal.style.display = "block";
			  modalImg.src = this.src;
			  captionText.innerHTML = this.alt;
			}
			
			// Get the <span> element that closes the modal
			var span = document.getElementsByClassName("close3")[0];													// close#
			
			// When the user clicks on <span> (x), close the modal
			span.onclick = function()
			{ 
				modal.style.display = "none";
			}
			</script>

			<figcaption>
				Current example terminal output (click for enlarged view)
			</figcaption>
		</figure>
	</div>

	<div class="frame-footer">																							<!--------- filename (below) ------------>
		The code file for this example is available <a href="https://github.com/rontarrant/gtkd_demos/blob/master/006_text/text_09_shared_textbuffer.d" target="_blank">here</a>.
	</div>
</div>
<!-- end of snippet for second (2nd) occurrence of application and terminal screen shots on a single page -->

<p>Now, this gets a bit more complex. At some point in the hierarchy, we’ve got to establish a pointer to the first <code class="language-plaintext highlighter-rouge">TextView</code>’s <code class="language-plaintext highlighter-rouge">TextBuffer</code> and pass it along to the others. I decided to do this at the <code class="language-plaintext highlighter-rouge">AppBox</code> level which makes the most sense to me:</p>

<div class="language-d highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="k">class</span> <span class="n">AppBox</span> <span class="p">:</span> <span class="n">Box</span>
<span class="p">{</span>
	<span class="kt">bool</span> <span class="n">expand</span> <span class="p">=</span> <span class="kc">true</span><span class="p">,</span> <span class="n">fill</span> <span class="p">=</span> <span class="kc">true</span><span class="p">;</span>
	<span class="kt">uint</span> <span class="n">globalPadding</span> <span class="p">=</span> <span class="mi">10</span><span class="p">,</span> <span class="n">localPadding</span> <span class="p">=</span> <span class="mi">5</span><span class="p">;</span>
	<span class="n">ScrolledTextWindow</span> <span class="n">scrolledTextWindow</span><span class="p">;</span>
	<span class="n">TextView</span> <span class="n">masterTextView</span><span class="p">;</span>
	<span class="n">DependentTextView</span> <span class="n">dependentTextView</span><span class="p">;</span>
	<span class="n">TextBuffer</span> <span class="n">sharedTextBuffer</span><span class="p">;</span>
	
	<span class="k">this</span><span class="p">()</span>
	<span class="p">{</span>
		<span class="k">super</span><span class="p">(</span><span class="n">Orientation</span><span class="p">.</span><span class="n">VERTICAL</span><span class="p">,</span> <span class="n">globalPadding</span><span class="p">);</span>
		
		<span class="n">scrolledTextWindow</span> <span class="p">=</span> <span class="k">new</span> <span class="n">ScrolledTextWindow</span><span class="p">();</span>
		<span class="n">packStart</span><span class="p">(</span><span class="n">scrolledTextWindow</span><span class="p">,</span> <span class="n">expand</span><span class="p">,</span> <span class="n">fill</span><span class="p">,</span> <span class="n">localPadding</span><span class="p">);</span> <span class="c1">// TOP justify</span>
		
		<span class="c1">// grab the TextBuffer pointer</span>
		<span class="n">masterTextView</span> <span class="p">=</span> <span class="k">cast</span><span class="p">(</span><span class="n">TextView</span><span class="p">)</span><span class="n">scrolledTextWindow</span><span class="p">.</span><span class="n">getChild</span><span class="p">();</span>
		<span class="n">sharedTextBuffer</span> <span class="p">=</span> <span class="n">masterTextView</span><span class="p">.</span><span class="n">getBuffer</span><span class="p">();</span>
		<span class="n">dependentTextView</span> <span class="p">=</span> <span class="k">new</span> <span class="n">DependentTextView</span><span class="p">(</span><span class="n">sharedTextBuffer</span><span class="p">);</span>
		<span class="n">packStart</span><span class="p">(</span><span class="n">dependentTextView</span><span class="p">,</span> <span class="n">expand</span><span class="p">,</span> <span class="n">fill</span><span class="p">,</span> <span class="n">localPadding</span><span class="p">);</span>
		
	<span class="p">}</span> <span class="c1">// this()</span>

<span class="p">}</span> <span class="c1">// class AppBox</span>
</code></pre></div></div>

<p>Grabbing a pointer to the first <code class="language-plaintext highlighter-rouge">TextView</code>’s <code class="language-plaintext highlighter-rouge">TextBuffer</code> proves to be a two-step operation because the result of <code class="language-plaintext highlighter-rouge">getChild()</code> has to be <code class="language-plaintext highlighter-rouge">cast()</code> as a <code class="language-plaintext highlighter-rouge">TextView</code>. If not, the result is a generic <code class="language-plaintext highlighter-rouge">Widget</code> which doesn’t give us access to the <code class="language-plaintext highlighter-rouge">TextView</code>’s <code class="language-plaintext highlighter-rouge">getBuffer()</code> function.</p>

<p>And to complete this multi-association, the <code class="language-plaintext highlighter-rouge">DependentTextView</code> class looks like this:</p>

<div class="language-d highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="k">class</span> <span class="n">DependentTextView</span> <span class="p">:</span> <span class="n">TextView</span>
<span class="p">{</span>
	<span class="k">this</span><span class="p">(</span><span class="n">TextBuffer</span> <span class="n">sharedTextBuffer</span><span class="p">)</span>
	<span class="p">{</span>
		<span class="k">super</span><span class="p">(</span><span class="n">sharedTextBuffer</span><span class="p">);</span>
		
	<span class="p">}</span> <span class="c1">// this()</span>
	
<span class="p">}</span> <span class="c1">// class DependentTextView</span>
</code></pre></div></div>

<p>At this level, things are dead simple. The constructor takes the <code class="language-plaintext highlighter-rouge">TextBuffer</code> pointer as an argument and passes it along to the super-constructor.</p>

<p>If you type, copy, cut, or paste in one <code class="language-plaintext highlighter-rouge">TextView</code>, your actions are mirrored in the other… I’m sure there are uses for this type of thing, otherwise, why have this functionality, right?</p>

<h2 id="conclusion">Conclusion</h2>

<p>And that’s the basics of the <code class="language-plaintext highlighter-rouge">TextView</code> widget and its associated <code class="language-plaintext highlighter-rouge">TextBuffer</code>. Turning them into something more useful, such as a full-blown text editor, we’ll leave for another time.</p>

<p>Happy coding.</p>

<div class="blog-nav">
	<div style="float: left;">
		<a href="./0068-multi-level-treestore.html">Previous: Multi-level TreeStore</a>
	</div>
	<div style="float: right;">
		<a href="./0070-statusbar.html">Next: Statusbar Basics</a>
	</div>
</div>
<p>
	<h3></h3>
<div class="inpage-frame">
	<a href="https://github.com/sponsors/rontarrant">
		<BR>
		<BR>
		<B>Is this article useful? Educational? Entertaining, perhaps?</B>
		<BR>
		<figure class="left">
			<img src="../images/favorite_32.png" alt="Sponsorship heart" style="width: 32px; height: 32px;">
		</figure>
		You're free to accept or decline this invitation to become our newest sponsor.
	</a>
</div>
	<h4 class="comment-blurb"><B>Comments? Questions? Observations?</B></h4>
	<p>
		Did we miss a tidbit of information that would make this post even more informative? Let's talk about it in the comments.
	</p>
	<script src="https://utteranc.es/client.js"
		repo="rontarrant"
		issue-term="pathname"
		theme="github-light"
		crossorigin="anonymous"
		async>
	</script>
	<ul>
		<li> come on over to the <a href="https://forum.dlang.org/">D Language Forum</a> and look for one of the <i>gtkDcoding</i> announcement posts, </li>
		<li> drop by <a href="https://forum.gtkd.org/">the <i>GtkD Forum</i></a>,</li>
		<li> follow the link below to email me, or</li>
		<li> go to the	<a href="https://www.facebook.com">gtkDcoding Facebook page.</a></li>
	</ul>
</p>
<p> You can also subscribe <a href="/feed.xml">via RSS</a> so you won't miss anything. Thank you very much for dropping by.</p>
<p>&copy; Copyright 2025 Ron Tarrant </p>
</div>

	<a class="u-url" href="./0069-textview-and-textbuffer.html" hidden></a>
</article>

      </div>
    </main><footer class="site-footer h-card">
  <data class="u-url" href="/"></data>

  <div class="wrapper">

    <h2 class="footer-heading">gtkDcoding</h2>

    <div class="footer-col-wrapper">
      <div class="footer-col footer-col-1">
        <ul class="contact-list">
          <li class="p-name">Ron Tarrant</li><li><a class="u-email" href="mailto:gtkDcoding@gmail.com">gtkDcoding@gmail.com</a></li></ul>
      </div>

      <div class="footer-col footer-col-2"><ul class="social-media-list"><li><a href="https://github.com/rontarrant"><svg class="svg-icon"><use xlink:href="../assets/minima-social-icons.svg#github"></use></svg> <span class="username">rontarrant</span></a></li></ul>
</div>

      <div class="footer-col footer-col-3">
        <p>Simple examples of how to use GtkD to build GUI applications.</p>
      </div>
    </div>

  </div>

</footer>
</body>

</html>
